<template>
<div>


<el-dialog title="成为会员②:" :visible.sync="user">
  <el-form :model="IdCardForm">
    <el-form-item label="真实姓名" :label-width="formLabelWidth">
      <el-input v-model="IdCardForm.name" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item label="身份证号" :label-width="formLabelWidth">
      <el-input v-model="IdCardForm.idcard" autocomplete="off"></el-input>
    </el-form-item>

  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="close">取 消</el-button>
    <el-button type="primary" @click="oneopen">确 定</el-button>
  </div>
</el-dialog>
<el-dialog title="成为会员①：缴纳保证金" :visible.sync="user2">
  <el-form :model="userForm">
    <el-form-item label="输入缴纳的金额" :label-width="formLabelWidth">
      <el-input v-model="userForm.guartantee" autocomplete="off"></el-input>
    </el-form-item>

  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="close">取 消</el-button>
    <el-button type="primary" @click="twoopen">确 定</el-button>
  </div>
</el-dialog>
 <el-button :plain="true" @click="open2"></el-button>
</div>
    

</template>
<script>
  export default {
    name:'idnum',
    data() {
      return {
        IdCardForm: {
          name: '',
          idcard: '',
        },
        userForm: {
          id:5,
          guartantee:'',
        },
        formLabelWidth: '120px',
        user:this.$route.query.user=="true"?true:false,
        user2:false
      };
    },
    
    methods: {
      oneopen() {
          //发送ajax请求到后台，加载数据
          this.$ax.put('/epai/test-idcard/authenticationVip',this.IdCardForm).then((response)=>{//axios返回的response并不是后端响应数据，而是经过了封装，提供更为丰富的数据
              if(response.data.success){
                  this.user = false;
                  this.open2();
                  this.user2 = true;
                  sessionStorage.setItem("message",'已是会员');
              }
              else{
                this.$notify({
                  title:'提示',
                  message:response.data.message,
                  type:'error',
                  duration:1000
                })
              } 
            });           
        },
        twoopen() {
          this.id = sessionStorage.getItem("id");
          //发送ajax请求到后台，加载数据
          this.$ax.put('/epai/user/addVip',this.userForm).then((resp)=>{//axios返回的response并不是后端响应数据，而是经过了封装，提供更为丰富的数据
          
            const divForm = document.getElementsByTagName("div");
            if (divForm.length) {
             document.body.removeChild(divForm[0]);
           }
            const div = document.createElement("div");
            div.innerHTML = resp.data; // data就是接口返回的form 表单字符串
           document.body.appendChild(div);
            document.forms[0].setAttribute("target", "_blank"); // 新开窗口跳转
            document.forms[0].submit();
                  this.user2 = false;
                  this.$router.push({path:'/vips'});
            });           
        },
     close(){
       this.$router.push({path:'/index'});
     },
       open2() {
        this.$message({
          showClose: true,
          message: '身份认证通过,请缴纳保证金',
          type: 'success'
        });
      },
    }
  };
</script>
